<?php

class Comp {

    /**
     * 快速输出头部
     *
     * @param array $nav 导航位置
     * @return void
     */
    public static function top(array $nav) {
        $breadcrumb = '';
        foreach ($nav as $key=>$value) {
            $breadcrumb .= "<el-breadcrumb-item>${value}</el-breadcrumb-item>";
        }
        echo "
        <c-top name='测试管理'>
            <el-breadcrumb separator='/' slot='nav'>
                ${breadcrumb}
            </el-breadcrumb>
            <template slot='link'>
                <a href='javascript:window.history.go(-1)'><i class='el-icon-arrow-left'></i></a>
                <a href='javascript:window.location.reload()'><i class='el-icon-refresh'></i></a>
                <a href='#'><i class='el-icon-question'></i></a>
            </template>
        </c-top>
        ";
    }

    /**
     * 快速输出列表条目
     *
     * @param string $title 表头标题
     * @param string $data 绑定的数据
     * @param integer $width 宽度像素数，默认0像素
     * @return void
     */
    public static function listItem(string $title, string $data, int $width = 0) {
        $width = $width == 0 ? '' : "width='${width}'";
        echo "<el-table-column label='${title}' align='center' ${width} prop='${data}'></el-table-column>";
    }

    /**
     * 快速输出列表条目（日期时间）
     *
     * @param string $title 表头标题
     * @param string $data 绑定的数据
     * @param integer $width 宽度像素数，默认0像素
     * @return void
     */
    public static function listItemDatetime(string $title, string $data, int $width = 0) {
        $width = $width == 0 ? '' : "width='${width}'";
        echo "
        <el-table-column label='${title}' ${width}>
            <template slot-scope='scope'>
                <i class='el-icon-time'></i>
                <span style='margin-left: 8px'>{{ scope.row.${data} }}</span>
            </template>
        </el-table-column>        
        ";
    }

    /**
     * 快速输出列表操作列
     *
     * @param array $arr 配置数组
     * @return void
     */
    public static function listOperation(array $arr) {
        $buttons = self::_arrayToButtons($arr);
        echo "
        <el-table-column label='操作' align='center'>
            <template slot-scope='scope'>
                ${buttons}
            </template>
        </el-table-column>
        ";
    }


    /**
     * 输出列表下的功能按钮
     *
     * @param array $arr 配置数组
     * @return void
     */
    public static function func(array $arr) {
        $buttons = self::_arrayToButtons($arr);
        echo "
        <div class='func'>
            $buttons
        </div>
        ";
    }

    /**
     * 输出分页条
     *
     * @return void
     */
    public static function paging() {
        echo "
        <div class='paging'>
            <el-pagination
                background
                layout='total, prev, pager, next, jumper'
                @current-change='pagingChangeCurrent'
                :current-page='paging.current'
                :page-size='paging.size'
                :total='paging.total'
            >
            </el-pagination>
        </div>
        ";
    }

    /**
     * 快速输出dialogFooter
     *
     * @param string $event 事件名称
     * @param int $showNum 使用的dialog.show编号
     * @return void
     */
    public static function dialogFooter(string $eventOK, int $showNum = 1) {
        echo "
        <div slot='footer'>
            <el-button size='small' @click=\"dialogHide(${showNum})\">取 消</el-button>
            <el-button size='small' type='primary' @click=\"${eventOK}\">确 定</el-button>
        </div>
        ";
    }

    /**
     * 将数组转换为button
     *
     * @param array $arr button配置数组
     * @return void
     */
    private static function _arrayToButtons(array $arr) {
        $buttons = '';
        foreach ($arr as $key=>$value) {
            $name = $value[0];
            $event = $value[1];
            if (!isset($value[2])) {
                $buttons .= "<el-button size='small' @click=\"${event}\">${name}</el-button>";
            } else {
                $type = $value[2];
                $buttons .= "<el-button size='small' type='${type}' @click=\"${event}\">${name}</el-button>";
            }
        }
        return $buttons;
    }
}
